<template>
	<view class="discounts">
		<view class="discounts-item" v-for="(item,index) in discounts" :key="index">
			<uni-card :is-shadow="false" is-full>
				<view style="height: 100%;overflow: auto;">
					<view class="discountss">
						<view class="topTitle">
							{{item.name}}
						</view>
						<view style="display: flex;">
							<view class="discountsPrice">
								<text>￥{{item.amount}}</text>

							</view>
							<view style="">
								<text>{{item.note}} </text><br>
								<text> 到期时间:{{item.endTime | formatCreateTimes}}</text>
							</view>
							<view style="color: white;font-weight: 700;
										position: relative;
										 top: 10rpx;
										 padding-left: 10rpx;
									font-size: 30rpx;
									"   @tap="useDiscount">
								立即使用
							</view>
						</view>
					</view>
				</view>
			</uni-card>
		</view>
	</view>
</template>

<script>
	import {
		formatDate
	} from "@/utils/Time.js"
	export default {
		data() {
			return {
				discounts: []
			}
		},
		onLoad() {
			this.getList()
		},
		filters: {
			formatCreateTimes(time) {
				if (time == null || time === '') {
					return 'N/A';
				}
				let date = new Date(time);
				return formatDate(date, 'yyyy-MM-dd')
			},
		},
		methods: {
			getList() {
				this.$api.user.portalCouponList().then(res => {
					if (res.code == 200) {
						this.discounts = []
						for (let i in res.data) {
							if (res.data[i] != null) {
								this.discounts.push(res.data[i])
							}
						}
						console.log(this.discounts);

					} else {
						uni.showToast({
							title: "请联系管理员",
							icon: "error"
						})
					}
				})
			},
			useDiscount(){
				uni.showToast({
					title:"敬请期待",
					icon:"loading"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.discounts {
		.discounts-item {
			margin-top: 10rpx;

			.discountss {
				height: 140rpx;
				width: 100%;
				background-color: #f4a4a4;
				// background-image: linear-gradient(to right, #f80f0f, #e82222, red);
				overflow: hidden;

				.topTitle {
					height: 40rpx;
					width: 250rpx;
					line-height: 40rpx;
					text-align: center;
					// background-color:   #cb0d0d;
					color: white;
					font-weight: 700;
				}

				.discountsPrice {
					font-size: 50rpx;
					line-height: 80rpx;
					color: white;
					font-weight: 700;
					width: 250rpx;
					text-align: center;
				}
			}
		}

		.uni-card--border {
			border: 0;
		}

	}
</style>
